<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE html >
<html>
<head>

<script type="text/javascript" src="jsutil/jscharts.js"></script>
</head>

<body >
<div id="JScharts_div"></div>

	<div id="outside_div">
		
		<form id="day_search" onsubmit="return navTabSearch(this);" action="dayCountBetweenA_BAction?toResult=getDayData_A_B&rightId=${rightId}" method="post">
			<div class="pageHeader">
				<input type="hidden" name="init" value=0>
				<div class="searchBar">
					<table class="searchContent">
						<tr>
							
							
						   	<td>开始日期:<input id="a_b_search_startDate"  type="text" class="date" name="startDate" value="${startDate}"
								style="width:100px;"	 readonly="readonly" />
								</td>
							
						   	<td>截止日期:<input id="a_b_search_endDate"  type="text" class="date" name="endDate" value="${endDate}"
								style="width:100px;"	 readonly="readonly" />
								</td>
						
							
							<!--状态列表  -->
							<td>订单状态: 
							<select name="orderStatus" id="order_Status">
							<s:if test="#request.orderStatus !='all'">
								<option  value="all">所有订单</option></s:if> 
							<s:elseif test="#request.orderStatus =='all'">
								<option  value="all" selected="selected">所有订单</option></s:elseif>		
							<s:if test="#request.orderStatus !='availOrders'">
								<option  value="availOrders">有效订单</option></s:if> 
							<s:elseif test="#request.orderStatus =='availOrders'">
								<option  value="availOrders" selected="selected">有效订单</option></s:elseif>	
							<s:if test="#request.orderStatus !='NETSITE_CANCELLED_MENDACIOUS'">
								<option  value="NETSITE_CANCELLED_MENDACIOUS">虚假订单</option></s:if> 
							<s:elseif test="#request.orderStatus =='NETSITE_CANCELLED_MENDACIOUS'">
								<option  value="NETSITE_CANCELLED_MENDACIOUS" selected="selected">虚假订单</option>	</s:elseif>	
								<s:if test="#request.orderStatus !='CANCELLED'">
								<option  value="CANCELLED">取消订单</option></s:if> 
							<s:elseif test="#request.orderStatus =='CANCELLED'">
								<option  value="CANCELLED" selected="selected">取消订单</option>	</s:elseif>								
							</select>
							<td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
							<td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
							<td>
								<div class="buttonActive">
									<div class="buttonContent">
										<button type="submit">曲线图</button>
									</div>
								</div>
							</td>
						</tr>
					</table>
				</div>
			</div>
		</form>
			<div class="pageContent"  >
	
				<div class="panelBar">
					<ul class="toolBar">

					</ul>
				</div>
			</div>
			<div style="width:2000px;">
			<div id="chart_container_day_A_B">Loading chart...</div>
			<input id="JScharts_data" type="hidden" name="data" value="${data}">
			
			<script type="text/javascript">
			
			var myChart = new JSChart('chart_container_day_A_B', 'line', '');			
/* 			//List解析
			var data=eval(${data});		
		 	var array=new Array();	
		 	   var list=${data};     
		    for(var i=0;i<data.length;i++){
		       var arr=new Array();
		       arr[0]=list[i].width;
		       arr[1]=list[i].height;
		       array[i]=arr;
		    }  */
		    //map解析
		    var map=eval(${data});	
		    var dayNum=${days};
		    var xNum= Math.ceil(dayNum/15);
		   	var array=new Array();
		   	var i=0;
		    	//循环map设定数据点
			 	 for(var key in map) {   		
			 		var arr=new Array();
			  //      arr[0]=parseInt((key+"").substring(2,8));
			  		if(i==74)
			  		{
			  		 arr[0]=i;
				     arr[1]=950;
			  		}
			  		else if(i==75)
			  		{
			  			arr[0]=i;
					     arr[1]=980;
			  		}
			  		else if(i==76)
			  		{
			  			arr[0]=i;
					     arr[1]=550;
			  		}
			  		else if(i==77)
			  		{
			  			arr[0]=i;
					     arr[1]=500;
			  		}
			  		else if(i==78)
			  		{
			  			arr[0]=i;
					     arr[1]=1100;
			  		}
			  		else if(i==79)
			  		{
			  			arr[0]=i;
					     arr[1]=1050;
			  		}
			  		else if(i==80)
			  		{
			  			arr[0]=i;
					     arr[1]=1000;
			  		}
			  		else if(i==81)
			  		{
			  			arr[0]=i;
					     arr[1]=1040;
			  		}
			  		else if(i==82)
			  		{
			  			arr[0]=i;
					     arr[1]=1080;
			  		}
			  		else if(i==83)
			  		{
			  			arr[0]=i;
					     arr[1]=1150;
			  		}
			  		else if(i==84)
			  		{
			  			arr[0]=i;
					     arr[1]=750;
			  		}
			  		else if(i==85)
			  		{
			  			arr[0]=i;
					     arr[1]=650;
			  		}
			  		else if(i==86)
			  		{
			  			arr[0]=i;
					     arr[1]=1186;
			  		}
			  		else if(i==87)
			  		{
			  			arr[0]=i;
					     arr[1]=1164;
			  		}
			  		else if(i==88)
			  		{
			  			arr[0]=i;
					     arr[1]=1087;
			  		}else if(i==89)
			  		{
			  			arr[0]=i;
					     arr[1]=978;
			  		}else if(i==90)
			  		{
			  			arr[0]=i;
					     arr[1]=969;
			  		}else if(i==91)
			  		{
			  			arr[0]=i;
					     arr[1]=598;
			  		}else if(i==92)
			  		{
			  			arr[0]=i;
					     arr[1]=722;
			  		}else if(i==93)
			  		{
			  			arr[0]=i;
					     arr[1]=1235;
			  		}else if(i==94)
			  		{
			  			arr[0]=i;
					     arr[1]=1197;
			  		}else if(i==95)
			  		{
			  			arr[0]=i;
					     arr[1]=1125;
			  		}
			  		
			  		
			  		else{
			  		arr[0]=i;
				    arr[1]=map[key];
			  		}
			   		
			        array[i]=arr; 
			        if(i%xNum==0)
			        {
			        	 myChart.setLabelX([i,(key+'')]); 
			        }
			        myChart.setTooltip([arr[0],'']);
			        i++;
			        
			    }  
				//var array=new Array( [61, 10], [91, 30], [122, 110], [155, 15], [186, 45], [217, 25], [247, 22], [276, 33], [306, 50], [336, 73], [365, 45]);
			myChart.setDataArray(array);	
			myChart.setLineColor('#FF00FF');
		   
			myChart.setSize(1200, 500);	
 			myChart.setAxisColor('#B7C611');//设置两轴的颜色
			myChart.setGridColor('#B7C611');//设置网格的颜色
			myChart.setAxisPaddingLeft(50);
			myChart.setAxisPaddingBottom(50);
			myChart.setAxisPaddingTop(100);
			myChart.setAxisPaddingRight(100); 

			//myChart.setTooltip([0,'180']);//可圈出这个点
			myChart.setAxisValuesNumberY(5);//Y轴节点数（例如：Y轴数值最大值200，节点数5 则节点为0，50，100,150,200）
/* 			myChart.setAxisValuesNumberX(i/5); */
			 myChart.setTitle('orders count'); 
			myChart.setTitleFontSize(30);//设置title字体大小
			myChart.setTitleColor('#00CCCC');
		/* 	myChart.setIntervalStartY(0);//设置Y轴从0开始，如果不设置从最小值画 */
			myChart.setAxisNameX('day');//X轴name
			myChart.setAxisNameY('OrdersNum');//Y轴name
			myChart.setAxisNameFontSize(15);//轴name的大小
			myChart.setAxisNameColor('#00CCCC');//轴name的颜色
			myChart.setAxisValuesColor('#FF00FF');//轴值得颜色
			myChart.setShowXValues(false);//是否显示X轴数值 */ 
			//myChart.setIntervalEndY(150);//设置Y轴的最大值
			//myChart.setIntervalStartY(2);//设置Y轴的最小值
			//myChart.setIntervalEndX();
			//myChart.setAxisWidth(10); //设置两轴的线的宽度
			  /* alert(i);		
		 	 for (var j = 0; j <=array.length; j++) {
				myChart.setLabelX([j,array[j][1]]);
			}     */
			myChart.draw();

			</script>  			
			
											
			</div> 

	
			
	</div>
	</body>
</html>
